.codepen-wrapper[data-codepen-id="KwwRqV"] * {
box-sizing: border-box;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] html {
width: 100%;
min-height: 100%;
background: #232323;
background: #7d7e7d;
background: -moz-radial-gradient(center, ellipse cover, #7d7e7d 0%, #0e0e0e 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #7d7e7d), color-stop(100%, #0e0e0e));
background: -webkit-radial-gradient(center, ellipse cover, #7d7e7d 0%, #0e0e0e 100%);
background: -o-radial-gradient(center, ellipse cover, #7d7e7d 0%, #0e0e0e 100%);
background: -ms-radial-gradient(center, ellipse cover, #7d7e7d 0%, #0e0e0e 100%);
background: radial-gradient(ellipse at center, #7d7e7d 0%, #0e0e0e 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d7e7d',endColorstr='#0e0e0e',GradientType=1);
background-repeat: no-repeat;
background-size: 100% 100%;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] body {
font-family: sans-serif;
text-align: center;
padding: 50px 10px 150px;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] label, .codepen-wrapper[data-codepen-id="KwwRqV"] select {
float: left;
display: inline-block;
margin-bottom: 5px;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] label {
padding-right: 20px;
width: 140px;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] select {
width: 140px;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] select + label {
clear: both;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] label + select + label, .codepen-wrapper[data-codepen-id="KwwRqV"] label + select + label + select {
margin-top: 10px;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] #world {
-webkit-animation: spin 20s 0 linear infinite;
animation: spin 20s 0 linear infinite;
display: inline-block;
transform-origin: center center 0;
transform-style: preserve-3d;
backface-visibility: hidden;
vertical-align: middle;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] #world > div {
position: absolute;
background: #666;
background: #000;
top: 50%;
left: 50%;
transform-origin: center center 0;
transform-style: preserve-3d;
backface-visibility: hidden;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] #controls-wrapper {
position: absolute;
display: block;
bottom: 0;
left: 0;
right: 0;
width: 100%;
}

.codepen-wrapper[data-codepen-id="KwwRqV"] #controls {
position: relative;
display: inline-block;
background: #f9f9f9;
border: solid 1px #232323;
color: #232323;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
padding: 20px 30px;
vertical-align: middle;
text-align: right;
}

@-webkit-keyframes spin {
from {
transform: rotateY(0deg);
}
to {
transform: rotateY(-360deg);
}
}
@-moz-keyframes spin {
from {
transform: rotateY(0deg);
}
to {
transform: rotateY(-360deg);
}
}
@keyframes spin {
from {
transform: rotateY(0deg);
}
to {
transform: rotateY(-360deg);
}
}